﻿@using KXCXW.Web.CommonClass.Ext
@model kxcxw.Data.Entities.PublichInformation
@using KXCXW.Web.CommonClass
@{
    ViewBag.Title = "开心促销网-" + Model.Title;    
    ViewBag.Description = Model.Title;
    ViewBag.keywords = "开心促销网-" + Model.Title;
    Layout = "~/Views/Shared/_MyInfoLayout.cshtml";

}
<script src="@Url.Content("~/Scripts/ImageZoom/CJL.0.1.min.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/ImageZoom/ImageZoom.js")" type="text/javascript"></script>
<script type="text/javascript">

    ImageZoom._MODE = {
        //跟随
        "follow": {
            methods: {
                init: function () {
                    this._stylesFollow = null; //备份样式
                    this._repairFollowLeft = 0; //修正坐标left
                    this._repairFollowTop = 0; //修正坐标top
                },
                load: function () {
                    var viewer = this._viewer, style = viewer.style, styles;
                    this._stylesFollow = {
                        left: style.left, top: style.top, position: style.position
                    };
                    viewer.style.position = "absolute";
                    //获取修正参数
                    if (!viewer.offsetWidth) {//隐藏
                        styles = { display: style.display, visibility: style.visibility };
                        $$D.setStyle(viewer, { display: "block", visibility: "hidden" });
                    }
                    //修正中心位置
                    this._repairFollowLeft = viewer.offsetWidth / 2;
                    this._repairFollowTop = viewer.offsetHeight / 2;
                    //修正offsetParent位置
                    if (!/BODY|HTML/.test(viewer.offsetParent.nodeName)) {
                        var parent = viewer.offsetParent, rect = $$D.rect(parent);
                        this._repairFollowLeft += rect.left + parent.clientLeft;
                        this._repairFollowTop += rect.top + parent.clientTop;
                    }
                    if (styles) { $$D.setStyle(viewer, styles); }
                },
                repair: function (e, pos) {
                    var zoom = this._zoom,
					viewerWidth = this._viewerWidth,
					viewerHeight = this._viewerHeight;
                    pos.left = (viewerWidth / 2 - pos.left) * (viewerWidth / zoom.width - 1);
                    pos.top = (viewerHeight / 2 - pos.top) * (viewerHeight / zoom.height - 1);
                },
                move: function (e) {
                    var style = this._viewer.style;
                    style.left = e.pageX - this._repairFollowLeft + "px";
                    style.top = e.pageY - this._repairFollowTop + "px";
                },
                dispose: function () {
                    $$D.setStyle(this._viewer, this._stylesFollow);
                }
            }
        },
        //拖柄
        "handle": {
            options: {//默认值
                handle: ""//拖柄对象
            },
            methods: {
                init: function () {
                    var handle = $$(this.options.handle);
                    if (!handle) {//没有定义的话用复制显示框代替
                        var body = document.body;
                        handle = body.insertBefore(this._viewer.cloneNode(false), body.childNodes[0]);
                        handle.id = "";
                        handle["_createbyhandle"] = true; //生成标识用于移除
                    } else {
                        var style = handle.style;
                        this._stylesHandle = {
                            left: style.left, top: style.top, position: style.position,
                            display: style.display, visibility: style.visibility,
                            padding: style.padding, margin: style.margin,
                            width: style.width, height: style.height
                        };
                    }
                    $$D.setStyle(handle, { padding: 0, margin: 0, display: "none" });

                    this._handle = handle;
                    this._repairHandleLeft = 0; //修正坐标left
                    this._repairHandleTop = 0; //修正坐标top
                },
                load: function () {
                    var handle = this._handle, rect = this._rect;
                    $$D.setStyle(handle, {
                        position: "absolute",
                        width: this._rangeWidth + "px",
                        height: this._rangeHeight + "px",
                        display: "block",
                        visibility: "hidden"
                    });
                    //获取修正参数
                    this._repairHandleLeft = rect.left + this._repairLeft - handle.clientLeft;
                    this._repairHandleTop = rect.top + this._repairTop - handle.clientTop;
                    //修正offsetParent位置
                    if (!/BODY|HTML/.test(handle.offsetParent.nodeName)) {
                        var parent = handle.offsetParent, rect = $$D.rect(parent);
                        this._repairHandleLeft -= rect.left + parent.clientLeft;
                        this._repairHandleTop -= rect.top + parent.clientTop;
                    }
                    //隐藏
                    $$D.setStyle(handle, { display: "none", visibility: "visible" });
                },
                start: function () {
                    this._handle.style.display = "block";
                },
                move: function (e, x, y) {
                    var style = this._handle.style, scale = this._scale;
                    style.left = Math.ceil(this._repairHandleLeft - x / scale) + "px";
                    style.top = Math.ceil(this._repairHandleTop - y / scale) + "px";
                },
                end: function () {
                    this._handle.style.display = "none";
                },
                dispose: function () {
                    if ("_createbyhandle" in this._handle) {
                        document.body.removeChild(this._handle);
                    } else {
                        $$D.setStyle(this._handle, this._stylesHandle);
                    }
                    this._handle = null;
                }
            }
        },
        //切割
        "cropper": {
            options: {//默认值
                opacity: .5//透明度
            },
            methods: {
                init: function () {
                    var body = document.body,
					cropper = body.insertBefore(document.createElement("img"), body.childNodes[0]);
                    cropper.style.display = "none";

                    this._cropper = cropper;
                    this.opacity = this.options.opacity;
                },
                load: function () {
                    var cropper = this._cropper, image = this._image, rect = this._rect;
                    cropper.src = image.src;
                    cropper.width = image.width;
                    cropper.height = image.height;
                    $$D.setStyle(cropper, {
                        position: "absolute",
                        left: rect.left + this._repairLeft + "px",
                        top: rect.top + this._repairTop + "px"
                    });
                },
                start: function () {
                    this._cropper.style.display = "block";
                    $$D.setStyle(this._image, "opacity", this.opacity);
                },
                move: function (e, x, y) {
                    var w = this._rangeWidth, h = this._rangeHeight, scale = this._scale;
                    x = Math.ceil(-x / scale); y = Math.ceil(-y / scale);
                    this._cropper.style.clip = "rect(" + y + "px " + (x + w) + "px " + (y + h) + "px " + x + "px)";
                },
                end: function () {
                    $$D.setStyle(this._image, "opacity", 1);
                    this._cropper.style.display = "none";
                },
                dispose: function () {
                    $$D.setStyle(this._image, "opacity", 1);
                    document.body.removeChild(this._cropper);
                    this._cropper = null;
                }
            }
        }
    }

    ImageZoom.prototype._initialize = (function () {
        var init = ImageZoom.prototype._initialize,
		mode = ImageZoom._MODE,
		modes = {
		    "follow": [mode.follow],
		    "handle": [mode.handle],
		    "cropper": [mode.cropper],
		    "handle-cropper": [mode.handle, mode.cropper]
		};
        return function () {
            var options = arguments[2];
            if (options && options.mode && modes[options.mode]) {
                $$A.forEach(modes[options.mode], function (mode) {
                    //扩展options
                    $$.extend(options, mode.options, false);
                    //扩展钩子
                    $$A.forEach(mode.methods, function (method, name) {
                        $$CE.addEvent(this, name, method);
                    }, this);
                }, this);
            }
            init.apply(this, arguments);
        }
    })();

</script>
<!-- h2 stays for breadcrumbs -->
<div class="tuijian">
    <div class="leftimg">
    </div>
    <ul class="line_01">
        @{
            if (ViewData["TuijianProducts"] != null)
            {
                List<kxcxw.Data.Entities.PublichInformation> list = (List<kxcxw.Data.Entities.PublichInformation>)ViewData["TuijianProducts"];
                foreach (kxcxw.Data.Entities.PublichInformation item in list)
                {
                    var url = item.InfoType == 1 ? item.ShopUrl : Url.Action("ProductDetails", "Home", new { id = item.InformationID });
            <li><a href="@url" productId="@item.InformationID" target="_blank" class="pic line_01 @(item.InfoType == 1 ? "weburl" : "")">
                <img src="@Url.Content(ImgHelper.ImgFoldUrl(ImgHelper.img90) + (string.IsNullOrEmpty(item.MapUrl) ? "nullImage.jpg" : item.MapUrl))" title="@item.Title" /></a>
                <div class="rightinfo">
                    <a class="red @(item.InfoType == 1 ? "weburl" : "")" productId="@item.InformationID" href="@url" target="_blank" title="@item.Title">@Html.Truncate(item.Title, 12)</a><span
                        class="currentprice">现价：￥@string.Format("{0:0}",item.PresentPrice)</span> <a class="btnbuy @(item.InfoType == 1 ? "weburl" : "")" productId="@item.InformationID" href="@url" target="_blank">
                        </a>
                </div>
            </li> 
                }
            }
        }
    </ul>
    <div class="rightimg">
    </div>
</div>
<div class="product_details">
    <h3>
        @Model.Title
    </h3>
    <div class="product_info">
        <div class="pic">
            <div class="container">
                <img id="idImage2" class="line_01" width="300" height="300" />
                <div id="idViewer2" class="izViewer2">
                </div>
            </div>
            <div class="pic_list" id="idList">
            </div>
        </div>
        <div id="idHandle3" class="handle2">
        </div>
        <script type='text/javascript'>
            var arrPic = [];
        </script>
        @if (Model.PictureShow != null && Model.PictureShow!="")
        {
            foreach (string filename in System.Xml.Linq.XElement.Parse(Model.PictureShow).Elements().ToList())
            {
                if (filename != "")
                {
            <script type='text/javascript'>
                arrPic.push({ smallPic: "@Url.Content(ImgHelper.ImgFoldUrl(ImgHelper.img40) + filename)", originPic: "@Url.Content(ImgHelper.ImgFoldUrl(ImgHelper.img300) + filename)", zoomPic: "@Url.Content(ImgHelper.ImgFoldUrl(ImgHelper.img600) + filename)" });
            </script>
                }
            }
        }
        <script type="text/javascript">

            (function () {

                var iz = new ImageZoom("idImage2", "idViewer2", {
                    mode: "handle", handle: "idHandle3", scale: 2, delay: 0
                });

                var list = $$("idList"), image = $$("idImage2");

                $$A.forEach(arrPic, function (o, i) {
                    var img = list.appendChild(document.createElement("img"));
                    img.src = o.smallPic;
                    img.className = "line_01";
                    img.onclick = function () {
                        iz.reset({ originPic: o.originPic, zoomPic: o.zoomPic });
                        $$A.forEach(list.getElementsByTagName("img"), function (img) { img.className = "line_01"; });
                        img.className = "line_01 current";
                    }



                    if (!i) { img.onclick(); }
                })


            })()

        </script>
        <div class="right_info">
            <ul>
                <li><span>发布时间：</span><div>
                    @string.Format("{0:D}", Model.PublishDate)</div>
                    <span>浏 览：</span><div>
                        <font color="#cc0000">@Model.VisitsNumber</font>次</div>
                </li>
                <li><span>原 价：</span><div style="text-decoration: line-through">
                    @string.Format("{0:C}", Model.OriginalPrice)</div>
                </li>
                <li><span>促销价格：</span><div>
                    <font color="#cc0000" style="font-weight: bold; font-size: 14px;">@string.Format("{0:C}", Model.PresentPrice)</font></div>
                </li>
                @if (Model.PromotionType == "2FFAAFE0-2389-46F3-85DD-E45927FCB7FB")
                {
                    <li><font color="#cc0000"><span>赠 品：</span><div>@Model.Other</div>
                    </font></li>
                }
                <li><span>商 家：</span><div style="width:290px;">
                    @Model.BusinessName</div>
                </li>
                <li><span>详细地址：</span><div style="width:290px;">
                    @Model.Addres</div>
                </li>
                <li><span>联系电话：</span><div>
                    @Model.Mobile</div>
                </li>
                <li><span>联 系 人：</span><div>
                    @Model.ContactPerson</div>
                </li>
            </ul>
            <ul class="links">
                <li class="partake"><span><a title="查看推荐有礼规则" target="_blank" href="http://help.360buy.com/help/question-134.html">
                    推荐有礼</a>：</span>
                    <div>
                        <a title="推荐到新浪微博" id="site-sina" onclick="jdPshowRecommend('http://v.t.sina.com.cn/share/share.php?appkey=2445336821','sina');"
                            href="javascript:void(0)">sina</a> <a title="推荐到腾讯微博" id="site-qzone" onclick="jdPshowRecommend('http://v.t.qq.com/share/share.php?source=1000002&amp;site=http://www.kxcxw.com','qzone');"
                                href="javascript:void(0)">qzone</a> <a title="推荐到人人" id="site-renren" onclick="jdPshowRecommend('http://share.renren.com/share/buttonshare/post/1004?','renren');"
                                    href="javascript:void(0)">renren</a> <a title="推荐到开心网" id="site-kaixing" onclick="jdPshowRecommend('http://www.kaixin001.com/repaste/share.php?','kaixing');"
                                        href="javascript:void(0)">kaixing</a> <a title="推荐到豆瓣" id="site-douban" onclick="jdPshowRecommend('http://www.douban.com/recommend/?','douban');"
                                            href="javascript:void(0)">douban</a> <a title="推荐到MSN" id="site-msn" onclick="jdPshowRecommend('http://profile.live.com/badge/?','MSN');"
                                                href="javascript:void(0)">msn</a>
                    </div>
                </li>
                <script type="text/javascript">
                    function jdPshowRecommend(url, stype) {
                        var title = "@Model.Title";
                        var content = "我在开心促销网 发现了一个非常不错的商品：@Model.Title，促销价：¥@(string.Format("{0:00}", Model.PresentPrice))。感觉不错，分享一下";
                        var img = "http://www.kxcxw.com@(Url.Content(ImgHelper.ImgFoldUrl(ImgHelper.img300) + (string.IsNullOrEmpty(Model.MapUrl) ? "nullImage.jpg" : Model.MapUrl)))";
                        var productUrl = "http://www.kxcxw.com@(Url.Action("ProductDetails", "Home", new { id = Model.InformationID }))";
                        if (stype == "qzone") {
                            url = url + "&title=" + content + "&pic=" + img + "&url=" + productUrl;
                        }
                        if (stype == "sina") {
                            url = url + "&title=" + encodeURIComponent(content) + "&pic=" + encodeURIComponent(img) + "&url=" + encodeURIComponent(productUrl);

                            window.open(url, "", "height=500, width=600");
                        }
                        if (stype == "renren") {
                            url = url + "title=" + title + "&content=" + content + "&pic=" + img + "&url=" + productUrl;
                        }
                        if (stype == "kaixing") {
                            url = url + "rtitle=" + title + "&rcontent=" + content + "&rurl=" + productUrl;
                        }
                        if (stype == "douban") {
                            url = url + "title=" + title + "&comment=" + content + "&url=" + productUrl;
                        }
                        if (stype == "MSN") {
                            url = url + "url=" + productUrl + "&title=" + title + "&description=" + content + "&screenshot=" + img;
                        }
                        if (stype != "sina") {
                            window.open(encodeURI(url), "", "height=500, width=600");
                        }
                    }
                </script>
            </ul>
        </div>
    </div>
    <div class="product_descinfo">
        <ul>
            <li class="current" tabid="tabcontent1"><a href="javascript:void(0)">商品介绍</a></li>
            <li tabid="tabcontent2"><a href="javascript:void(0)">评论(<font color="#cc0000">@Model.InformationReviews.Count</font>)</a></li>
        </ul>
        <div class="desc_content">
            <div id="tabcontent1" class="tabcontent">
                @Html.DisplayTextFor(model => model.Desception)
            </div>
            <div id="tabcontent2" class="tabcontent wangyou_pl">
                @foreach (kxcxw.Data.Entities.InformationReview item in Model.InformationReviews.OrderByDescending(q => q.CreateDate))
                {
                    <dl>
                        <dt><span>@item.CreateDate</span>
                            @item.NickName
                        </dt>
                        <dd>
                            @item.ReViewContent
                        </dd>
                    </dl>
                }
                @Html.Partial("_CommentForm", ViewData["InformationReview"])
            </div>
        </div>
    </div>
</div>
<script language="javascript" type="text/javascript">
    $(function () {
        $(".desc_content #tabcontent2").hide();
        $(".product_descinfo li").click(function () {
            $(this).addClass("current").siblings().removeClass("current");
            var contentId = $(this).attr("tabid");
            $(".desc_content div.tabcontent").hide();
            $(".desc_content #" + contentId).show();
        })
    }
);

    $(document).ready(function () {
        $("TEXTAREA,input[focucmsg]").each(function () {
            $(this).val($(this).attr("focucmsg"));
            $(this).val($(this).attr("focucmsg")).css("color", "#979393");
            $(this).focus(function () {
                if ($(this).val() == $(this).attr("focucmsg")) {
                    $(this).val('');
                    $(this).val('').css("color", "#6b6969");
                }
            });
            $(this).blur(function () {
                if (!$(this).val()) {
                    $(this).val($(this).attr("focucmsg"));
                    $(this).val($(this).attr("focucmsg")).css("color", "#979393");
                }
            });
        });
    });


  

</script>
<style>
    .wangyou_pl dl
    {
        margin-bottom: 10px;
        padding-bottom: 6px;
        font-size: 12px;
        border-bottom: #CCC dashed 1px;
    }
    .wangyou_pl dt
    {
        text-align: left;
        height: 25px;
        line-height: 25px;
        color: #900;
    }
    .wangyou_pl dt span
    {
        float: right;
        color: #9F9F9F;
    }
    .wangyou_pl dd
    {
        line-height: 20px;
        color: #666;
    }
    .wangyou_pl p
    {
        color: #555555;
        float: left;
        margin: 0;
        position: relative;
        z-index: 1;
        line-height: 30px;
    }
    .wangyou_pl dt input
    {
        float: right;
    }
    .tie-textarea
    {
        background: url("/Content/img/logo.gif") no-repeat scroll center center #FFFFFF;
        border: 1px solid #DCDDDD;
        clear: both;
        color: #555555;
        font-size: 14px;
        height: 130px;
        padding: 5px 0 0 5px;
        text-align: left;
        width: 98%;
    }
    /*图片展示样式 开始*/
    .container
    {
        position: relative;
        height: 300px;
        width:300px;
    }
    
    .izViewer2
    {
        width: 360px;
        height: 300px;
        position: absolute;
        left: 310px;
        top: 0;
        display: none;
        border: 1px solid #999;
    }
    .handle2
    {
        display: none;
        opacity: 0.6;
        filter: alpha(opacity=60);
        background: #E6EAF3;
        cursor: crosshair;
    }
    /*图片展示样式 结束*/</style>
